<template>
    <div>
        <el-form :model="form" label-width="130px" ref="form" style="margin-top: -12px">
            <el-form-item label="套餐商品" class="one-label">
                <!-- 规格选择 -->
                <el-form-item label="规格类型：" label-width="170px">
                    <el-radio-group v-model="form.skuFlag" :disabled="stockBoolean && !!goodsId" @change="sendSkuFlg">
                        <template v-for="(val, key) in dict.skuFlag">
                            <el-radio :label="key" :key="key">{{ val }}</el-radio>
                        </template>
                    </el-radio-group>
                </el-form-item>
                <!-- 单规格 -->
                <el-form-item v-show="form.skuFlag == 0" label="" label-width="60px">
                    <span class="font-14 font-blue" @click="addSubGoods(-1)">添加子商品</span>
                    <div class="table-container pad-t-20 pad-b-20">
                        <div
                            class="el-table el-table--fit el-table--border el-table--enable-row-hover el-table--medium el-table--scrollable-x">
                            <div class="el-table__body-wrapper">
                                <table cellspacing="0" cellpadding="0" border="0" class="el-table__body"
                                    style="width: 100%">
                                    <thead class="el-table__header">
                                        <tr>
                                            <!-- 子商品名称 -->
                                            <th width="250">
                                                <div class="cell text-align-c">子商品名称</div>
                                            </th>
                                            <!-- 规格 -->
                                            <th width="200">
                                                <div class="cell text-align-c">规格</div>
                                            </th>
                                            <!-- 条形码 -->
                                            <th width="180">
                                                <div class="cell text-align-c">条形码</div>
                                            </th>
                                            <!-- 外部编码 -->
                                            <th width="180">
                                                <div class="cell text-align-c">外部编码</div>
                                            </th>
                                            <!-- 零售价 -->
                                            <th width="135">
                                                <div class="cell text-align-c">零售价</div>
                                            </th>
                                            <!-- 套餐包含数量 -->
                                            <th width="135">
                                                <div class="cell text-align-c">套餐包含数量</div>
                                            </th>
                                            <!-- 当前可用库存 -->
                                            <th width="135">
                                                <div class="cell text-align-c">当前可用库存</div>
                                            </th>
                                            <th width="135">
                                                <div class="cell text-align-c">操作</div>
                                            </th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-for="(item, index) in form.subGoodsList" :key="index">
                                            <td>
                                                <div class="flex v-align-c cursor-p">
                                                    <label>
                                                        <img :src="item.mainImage" class="width-68 height-68">
                                                    </label>
                                                    <div class="font-14 pad-l-10">
                                                        <div>{{ item.title }}</div>
                                                        <template>
                                                            <div>货号: {{item.goodsCode ? item.goodsCode : item.skuCode}}
                                                            </div>
                                                        </template>
                                                    </div>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="cell text-align-c">
                                                    {{ item.skuDetail ? item.skuDetail : '单规格' }}
                                                </div>
                                            </td>
                                            <td>
                                                <div class="cell text-align-c">
                                                    {{ item.goodsBarCode ? item.goodsBarCode : item.skuGoodsBarCode }}
                                                </div>
                                            </td>
                                            <td>
                                                <div class="cell text-align-c">{{ item.externalCode }}</div>
                                            </td>
                                            <td>
                                                <div class="cell text-align-c">{{ item.sellPrice }}</div>
                                            </td>
                                            <td>
                                                <div class="cell">
                                                    <el-input v-model="item.goodsNum"
                                                        @keyup.native="item.goodsNum = checkInputNum(item.goodsNum)"
                                                        placeholder="请输入数量"></el-input>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="cell text-align-c">{{ item.stock ? item.stock : 0 }}</div>
                                            </td>
                                            <td>
                                              <div class="cell text-align-c">
                                                <span class="font-14 font-blue" @click="removeSubGoodsList('', item)">删除</span>
                                              </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </el-form-item>

                <!-- 多规格 -->
                <el-form-item v-show="form.skuFlag == 1" label="商品规格：" label-width="170px">
                    <div v-if="form.goodsSource == 0" v-for="(item, index) in form.qualityData" :key="index"
                        class="quality-bar mar-b-15">
                        <div class="mar-b-20 position-r qta-item flex">
                            <span class="flex-item">
                                <el-select v-model="item.skuPropName" placeholder="请选择" @change="changeSelect(index)"
                                    ref="select">
                                    <el-option v-for="item in categorySkuList" :key="item.skuPropName"
                                        :label="item.skuPropName" :value="item.skuPropName" :disabled="item.disabled">
                                    </el-option>
                                    <el-option style="padding: 0" value="">
                                        <el-button style="width: 100%; border: none; " icon="el-icon-plus"
                                            @click="addSku">添加主规格</el-button>
                                    </el-option>
                                </el-select>
                            </span>
                            <i class="el-icon-error font-26 close-quality" v-if="!(goodsId && stockBoolean)"
                                @click="removeQta(item, index)"></i>
                        </div>
                        <el-row :gutter="20" class="pad-l-30 pad-r-30">
                            <el-col :span="8" v-for="(subItem, subIndex) in item.skuPropValueList" :key="subIndex"
                                class="flex v-align-c mar-b-10">
                                <span class="flex-item mar-r-10 position-r">
                                    <el-input v-model="subItem.skuPropValue" class="width-per-100"
                                        placeholder="子规格名称（比如：红色）" @blur="subInputBlur"></el-input>
                                    <i v-if="!(goodsId && stockBoolean)" class="el-icon-error close-sub"
                                        @click="removeSubQta(item.skuPropValueList, subIndex)"></i>
                                </span>
                                <template
                                    v-if="(subIndex + 1 == item.skuPropValueList.length) && !(goodsId && stockBoolean)">
                                    <span class="font-14 font-blue" @click="addSubQta(item)">添加子规格</span>
                                </template>
                            </el-col>
                        </el-row>
                    </div>
                    <div v-if="form.goodsSource == 0 && !(goodsId && stockBoolean)">
                        <el-button type="primary" size="small" @click="addQta">添加规格</el-button>
                    </div>
                    <div class="border-all">
                        <div class="flex border-b font-w" style="background:#F7F8FA">
                            <template>
                                <div v-for="(item, indexTh) in form.qualityData"
                                    class="width-135 pad-t-10 pad-b-10 border-r" :key="'indexTh-' + indexTh">
                                    <div class="cell text-align-c">
                                        {{ item.skuPropName }}
                                    </div>
                                </div>
                            </template>
                            <div class="cell text-align-c width-135 pad-t-10 pad-b-10 border-r">图片</div>
                            <div class="width-135 pad-t-10 pad-b-10 border-r">
                                <div class="cell text-align-c">
                                    <span>零售价(元)</span>
                                </div>
                            </div>
                            <!-- 样品价 “主播选品”增值功能开启时显示 -->
                            <div class="width-135 pad-t-10 pad-b-10 border-r"
                                v-if="enterpriseConfig.anchorSelectionAuthority == '1'">
                                <div class="cell text-align-c">
                                    <span>样品价(元)</span>
                                </div>
                            </div>
                            <div class="width-135 pad-t-10 pad-b-10 border-r" v-show="form.ladderAuth == 0">
                                <div class="cell text-align-c">
                                    <span>划线价</span>
                                </div>
                            </div>
                            <div class="width-135 pad-t-10 pad-b-10 border-r">
                                <div class="cell text-align-c">
                                    <template>
                                        <div class="cell text-align-c">库存</div>
                                    </template>
                                </div>
                            </div>
                            <div class="width-135 pad-t-10 pad-b-10 border-r">
                                <div class="cell text-align-c">
                                    <span>条形码</span>
                                </div>
                            </div>
                            <div class="width-135 pad-t-10 pad-b-10 border-r">
                                <div class="cell text-align-c">外部编码</div>
                            </div>
                        </div>
                        <div>
                            <!-- 规格为1个 -->
                            <template v-if="form.qualityData.length == 1">
                                <div v-for="(item, index) in form.singleTable" :key="index"
                                    class="flex border-b flex-col">
                                    <div class="flex border-b">
                                        <div class="width-135 pad-10 border-r">
                                            <span class="cell text-align-c">{{ item.skuPropValue }}</span>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell text-align-c">
                                                <div @click="changeImage(index)">
                                                    <el-upload list-type="picture-mini" action="/api/common/uploadFiles"
                                                        accept="image/jpeg,image/gif,image/png,image/bmp" name="files"
                                                        multiple v-loading="getLoading(index)" :data="token"
                                                        :show-file-list="false" :on-success="handleUploadSuccess"
                                                        :before-upload="beforeUpload">
                                                        <img v-if="item.imageUrl" :src="item.imageUrl" width="42px"
                                                            height="42px" style="margin-left: -1px; margin-top: -1px" />
                                                        <i v-else class="el-icon-plus"></i>
                                                    </el-upload>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.price"
                                                    @keyup.native=" item.price = checkInputNum(item.price)"
                                                    placeholder="请输入零售价"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r"
                                            v-if="enterpriseConfig.anchorSelectionAuthority == '1'">
                                            <div class="cell">
                                                <el-input v-model="item.specimenPrice"
                                                    @keyup.native=" item.specimenPrice = checkInputNum(item.specimenPrice)"
                                                    placeholder="请输入样品价"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r" v-if="form.ladderAuth == 0">
                                            <div class="cell">
                                                <el-input v-model="item.scribingPrice"
                                                    @keyup.native=" item.scribingPrice = checkInputNum(item.scribingPrice)"
                                                    placeholder="请输入划线价"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.stock"
                                                    @keyup.native="item.stock = checkInputNum(item.stock)"
                                                    placeholder="请输入库存" :disabled="stockBoolean"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.goodsBarCode" placeholder="请输入条形码"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.externalCode" placeholder="请输入外部编码"></el-input>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pad-10">
                                        <el-collapse v-model="activeNames">
                                            <el-collapse-item title="商品子列表" :name="index">
                                                <el-button type="primary" size="small" @click="addSubGoods(index)">添加子商品</el-button>
                                                <table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%">
                                                    <thead class="el-table__header">
                                                        <tr>
                                                            <th width="250">子商品名称</th>
                                                            <th>规格</th>
                                                            <th>条形码</th>
                                                            <th>外部编码</th>
                                                            <th>零售价</th>
                                                            <th>套餐包含数量</th>
                                                            <th>当前可用库存</th>
                                                            <th>操作</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr v-for="(item, subindex) in item.subGoodsList"
                                                            :key="'sub-goods' + subindex" class="text-c">
                                                            <td>
                                                                <div class="flex v-align-c cursor-p">
                                                                    <label>
                                                                        <img :src="item.mainImage"
                                                                            class="width-68 height-68">
                                                                    </label>
                                                                    <div class="font-14 pad-l-10">
                                                                        <div>{{ item.title }}</div>
                                                                        <template>
                                                                            <div>货号:
                                                                                {{item.goodsCode ? item.goodsCode : item.skuCode}}
                                                                            </div>
                                                                        </template>
                                                                    </div>
                                                                </div>
                                                            </td>
                                                            <td>{{ item.skuDetail ? item.skuDetail : '单规格' }}</td>
                                                            <td>{{ item.goodsBarCode ? item.goodsBarCode : item.skuGoodsBarCode }}
                                                            </td>
                                                            <td>{{ item.externalCode }}</td>
                                                            <td>{{ item.sellPrice }}</td>
                                                            <td>
                                                                <el-input v-model="item.goodsNum"
                                                                    @keyup.native=" item.goodsNum = checkInputNum(item.goodsNum)"
                                                                    placeholder="请输入数量"></el-input>
                                                            </td>
                                                            <td>{{ item.stock ? item.stock : 0 }}</td>
                                                            <td>
                                                              <el-button type="primary" size="small" @click="removeSubGoodsList(index, item)">删除</el-button>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </el-collapse-item>
                                        </el-collapse>
                                    </div>
                                </div>
                            </template>
                            <!-- 规格有2个以上 -->
                            <template v-else>
                                <div v-for="(item, index) in form.qualityTable" :key="'info-' + index">
                                    <div class="flex border-b">
                                        <template v-for="(subItem, subIndex) in item">
                                            <template v-if="subItem.skuPropId">
                                                <div :key="subIndex" class="width-135 pad-10 border-r">
                                                    <div class="cell text-align-c">
                                                        {{ subItem.skuPropValue }}
                                                    </div>
                                                </div>
                                            </template>
                                        </template>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell text-align-c">
                                                <div @click="changeImage(index)">
                                                    <el-upload list-type="picture-mini" action="/api/common/uploadFiles"
                                                        accept="image/jpeg,image/gif,image/png,image/bmp" name="files"
                                                        multiple v-loading="getLoading(index)" :data="token"
                                                        :show-file-list="false" :on-success="handleUploadSuccess"
                                                        :before-upload="beforeUpload">
                                                        <img v-if="item.imageUrl" :src="item.imageUrl" width="42px"
                                                            height="42px" style="margin-left: -1px; margin-top: -1px" />
                                                        <i v-else class="el-icon-plus"></i>
                                                    </el-upload>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.price"
                                                    @keyup.native="item.price = checkInputNum(item.price)"
                                                    placeholder="请输入零售价"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r"
                                            v-if="enterpriseConfig.anchorSelectionAuthority == '1'">
                                            <div class="cell">
                                                <el-input v-model="item.specimenPrice"
                                                    @keyup.native=" item.specimenPrice = checkInputNum(item.specimenPrice)"
                                                    placeholder="请输入样品价"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r" v-show="form.ladderAuth == 0">
                                            <div class="cell">
                                                <el-input v-model="item.scribingPrice"
                                                    @keyup.native="item.scribingPrice = checkInputNum(item.scribingPrice)"
                                                    placeholder="请输入划线价"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.stock"
                                                    @keyup.native="item.stock = checkInputNum(item.stock)"
                                                    placeholder="请输入库存" :disabled="stockBoolean"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.goodsBarCode" placeholder="请输入条形码"></el-input>
                                            </div>
                                        </div>
                                        <div class="width-135 pad-10 border-r">
                                            <div class="cell">
                                                <el-input v-model="item.externalCode" placeholder="请输入外部编码"></el-input>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pad-10 sub-list">
                                        <el-collapse v-model="activeNames">
                                            <el-collapse-item title="商品子列表" :name="index">
                                                <el-button type="primary" size="small" @click="addSubGoods(index)">添加子商品</el-button>
                                                <table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%">
                                                    <thead class="el-table__header">
                                                        <tr>
                                                            <th>子商品名称</th>
                                                            <th>规格</th>
                                                            <th>条形码</th>
                                                            <th>外部编码</th>
                                                            <th>零售价</th>
                                                            <th>套餐包含数量</th>
                                                            <th>当前可用库存</th>
                                                            <th>操作</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr v-for="(subItem, subindex) in item.subGoodsList" :key="'sub-goods' + subindex" class="text-c">
                                                            <td>
                                                                <div class="flex v-align-c cursor-p">
                                                                    <label>
                                                                        <img :src="subItem.mainImage"
                                                                            class="width-68 height-68">
                                                                    </label>
                                                                    <div class="font-14 pad-l-10">
                                                                        <div>{{ subItem.title }}</div>
                                                                        <template>
                                                                            <div>货号:
                                                                                {{subItem.goodsCode ? subItem.goodsCode : subItem.skuCode}}
                                                                            </div>
                                                                        </template>
                                                                    </div>
                                                                </div>
                                                            </td>
                                                            <td>{{ subItem.skuDetail ? subItem.skuDetail : '单规格' }}</td>
                                                            <td>{{ subItem.goodsBarCode ? subItem.goodsBarCode : subItem.skuGoodsBarCode }}
                                                            </td>
                                                            <td>{{ subItem.externalCode }}</td>
                                                            <td>{{ subItem.sellPrice }}</td>
                                                            <td>
                                                                <el-input v-model="subItem.goodsNum"
                                                                    @keyup.native="subItem.goodsNum = checkInputNum(subItem.goodsNum)"
                                                                    placeholder="请输入数量"></el-input>
                                                            </td>
                                                            <td>{{ subItem.stock ? subItem.stock : 0 }}</td>
                                                            <td>
                                                              <el-button type="primary" size="small" @click="removeSubGoodsList(index, subItem)">删除</el-button>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </el-collapse-item>
                                        </el-collapse>
                                    </div>
                                </div>
                            </template>
                        </div>
                    </div>
                </el-form-item>
            </el-form-item>
        </el-form>

        <!-- 商品选择弹层 -->
        <el-dialog :title="selectGoodsTitle" :visible.sync="selectGoodsVisible" :close-on-press-escape="true"
            width="1000px">
            <div>
                <goods-select></goods-select>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click="selectGoodsVisible = false">关闭</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import elDragDialog from '@/directive/el-dragDialog' // base on element-ui
import goodsSelect from '../goods-select'
import { getToken } from '@/utils/auth'
import { listCategorySku } from '@/api/goods/goods'
import { listSubGoods } from '@/api/goods/goods-combo.js'

export default {
  components: {
    goodsSelect
  },
  directives: {
    // 拖动窗口
    elDragDialog
  },
  props: {
    dict: {
      type: Object
    },
    fromListPage: {
      type: Number,
      default: 30
    },
    showEditButton: {
      type: Boolean,
      default: true
    },
    goodsId: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      activeName: '1',
      activeNames: [0],
      gradeVisible: false,
      gradeFlage: false,
      gradeList: [],
      ladderAuthFlag: false,
      updataFlag: false,
      tabDisabled: true,
      stockBoolean: false,
      token: '',
      fileLoading: false,
      loadingTotal: '0',
      showSingle: 1,
      form: {
        goodsSource: 0,
        ladderAuth: '0',
        skuFlag: '0',
        memberPrice: '',
        sellPrice: '',
        // 分销价
        distributePrice: '',
        distributeType: 1,
        distributeFee: '',
        shareMemberFee: '',
        levelOnePartnerFee: '',
        levelTwoPartnerFee: '',
        recruiterFee: '',
        anchorCommission: '',
        // 主播结算价
        anchorPaymentsPrice: '',
        // 样品价
        specimenPrice: '',
        stock: '',
        stockWarn: '',
        supplyPrice: '',
        scribingPrice: '',
        wholesalePrice: '',
        goodsBarCode: '',
        wholesaleDeliveryTemplateId: '',
        externalCode: '',
        wholesaleNum: '',
        postFeeType: '10',
        postFee: '',
        // 配送方式 1：快递 2：物流
        templateType: '1',
        wholesalePostFeeType: '10',
        wholesalePostFee: '',
        supplierPostFee: '',
        ladderType: '0',
        singleTable: [],
        qualityData: [{
          skuPropId: -1,
          skuPropName: '',
          categoryId: '',
          skuPropValueList: [{
            skuPropValue: '',
            skuPropValueId: -2,
            skuPropId: -1,
            skuPropName: ''
          }]
        }],
        qualityTable: [],
        qualityTableIndex: 0,
        dataTable: [],
        // 供应价含税
        supplierTaxFlag: '1',
        subGoodsList: []
      },
      // 最小零售价
      minSellPrice: 0.00,
      // 最大零售价
      maxSellPrice: 0.00,
      // 外部编码表单
      externalCodeConfigForm: {},
      ids: [],
      imageIndex: '',
      fileChangeFlag: '0',
      editSkuParamSettingVisible: false,
      skuParamSettingValue: '',
      skuParamSettingLabel: '',
      skuParamSettingTitle: '批量修改SKU零售价',
      skuParamSettingType: '',
      visiblePopPrice: false,
      visiblePopDistributePrice: false,
      visiblePopMemberPrice: false,
      // 批量设置主播结算价
      visiblePopAnchorPrice: false,
      visiblePopSpecimenPrice: false,
      visiblePopScribingPrice: false,
      visiblePopWholesalePrice: false,
      visiblePopSupplyPrice: false,
      visiblePopStock: false,
      visiblePopWarnStock: false,
      visiblePopGoodsBarCode: false,
      visiblePopExternalCode: false,
      visibleDeliveryTemplateId: false,
      visibleWholesaleDeliveryTemplateId: false,
      selectGoodsVisible: false,
      selectGoodsTitle: null,
      categoryId: '',
      categorySkuList: [],
      tempList: [],
      enterpriseConfig: {
        partnerAuthority: 0,
        deliveryTemplateAuthority: 0,
        // 合伙人提成比例取用规则 1:按合伙人 2：按商品
        patternCommissionType: 1,
        // 招募员提成比例取用规则 1:按招募员 2：按商品
        recruiterCommissionType: 1
      },
      // 税目列表
      taxList: []
    }
  },
  computed: {},
  // 初始化页面
  created() {
    this.token = {
      accessToken: getToken()
    }
    this.initGoodsEdit()
    this.busMonitor()
  },
  mounted() {
    const that = this
    // 监听info页面的enterpriseConfig信息
    this.$bus.$on('info.enterpriseConfig', function(data) {
      that.enterpriseConfig = data
    })
    this.$bus.$on('goods_supplier.stockBoolean', function(stockBoolean) {
      that.stockBoolean = stockBoolean
    })
    this.$bus.$on('goods.edit.categoryId', function(categoryId) {
      that.categoryId = categoryId
      that.categoryChange()
    })
    this.$bus.$on('skuFlag', function(flag) {
      that.form.skuFlag = flag
    })
  },
  watch: {
    tempList(newVal) {
      for (const tag of this.categorySkuList) {
        tag.disabled = false
      }
      for (const tempitem of newVal) {
        for (const listitem of this.categorySkuList) {
          if (listitem.skuPropName === tempitem) {
            listitem.disabled = true
          }
        }
      }
    }
  },
  methods: {
    // 切换规格类型(单规格/多规格)
    sendSkuFlg() {
      this.$bus.$emit('skuFlag', this.form.skuFlag)
      // 重置单规格子商品
      this.form.subGoodsList = null
    },
    // 商品规格下拉切换
    changeSelect(index) {
      this.tempList = []
      for (const item of this.form.qualityData) {
        if (item.categoryId !== '') {
          this.tempList.push(item.categoryId)
        }
      }
      const skuProp = this.form.qualityData[index]
      skuProp.skuPropId = this.getID()
      skuProp.skuPropValueList.forEach(skuPropValue => {
        skuPropValue.skuPropId = skuProp.skuPropId
        skuPropValue.skuPropName = skuProp.skuPropName
        skuPropValue.skuPropValueId = this.getID()
      })
    },
    // 添加sku
    addSku() {
      this.$prompt('请输入规格', '', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      })
        .then(({
          value
        }) => {
          const date = {
            skuPropName: value
          }
          this.categorySkuList.push(date)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          })
        })
    },
    // 删除一级规格
    removeQta(item, index) {
      if (this.form.qualityData.length > 1) {
        this.$confirm('此操作将删除该规格，是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.form.qualityData.splice(index, 1)
          this.tempList.splice(index, 1)
          this.qualityInit()
        })
      }
    },
    // 刷新一下属性名称
    subInputBlur() {
      if (this.form.qualityData.length === 1) {
        // 只有一个规格的，刷新一下属性名称
        const skuPropId = this.form.qualityData[0].skuPropId
        const skuPropName = this.form.qualityData[0].skuPropName
        const skuPropValueList = this.form.qualityData[0].skuPropValueList
        const singleTableList = this.form.singleTable
        for (let i = 0; i < singleTableList.length; i++) {
          singleTableList[i].skuPropId = skuPropId
          singleTableList[i].skuPropName = skuPropName
          singleTableList[i].skuPropValue = skuPropValueList[i].skuPropValue
          singleTableList[i].skuPropValueId = skuPropValueList[i].skuPropValueId
        }
        this.form.singleTable = JSON.parse(JSON.stringify(singleTableList))
      }
    },
    // 添加一级规格
    addQta() {
      const propId = this.getID()
      const valueId = this.getID()
      for (const item of this.form.qualityData) {
        if (item.skuPropName !== '') {
          this.tempList.push(item.skuPropName)
          this.tempList = Array.from(new Set(this.tempList))
        }
      }
      for (const tempitem of this.tempList) {
        for (const listitem of this.categorySkuList) {
          if (listitem.skuPropName === tempitem) {
            listitem.disabled = true
          }
        }
      }
      this.form.qualityData.push({
        categoryId: '',
        skuPropId: propId,
        skuPropName: '',
        skuPropValueList: [{
          skuPropValue: '',
          skuPropValueId: valueId,
          skuPropId: propId,
          skuPropName: ''
        }]
      })
      this.qualityInit()
    },
    // 删除子规格
    removeSubQta(item, subIndex) {
      // 子规格不能少于1个
      if (item.length > 1) {
        item.splice(subIndex, 1)
      }
      this.qualityInit()
    },
    // 添加子规格
    addSubQta(item) {
      const valueId = this.getID()
      const data = {
        skuPropValue: '',
        skuPropValueId: valueId,
        imageUrl: '',
        price: '',
        // 分销价
        distributePrice: '',
        anchorPaymentsPrice: '',
        specimenPrice: '',
        memberPrice: '',
        scribingPrice: '',
        wholesalePrice: '',
        goodsBarCode: '',
        wholesaleDeliveryTemplateId: '',
        externalCode: '',
        stock: '',
        warnStock: ''
      }
      item.skuPropValueList.push(data)
      this.qualityInit()
    },
    // 数列展示
    qualityInit() {
      if (this.form.qualityData.length === 0) {
        this.addQta()
      }
      const arrQta = []
      const itemQta = this.form.qualityData
      if (itemQta.length === 1) {
        const skuPropId = itemQta[0].skuPropId
        const skuPropName = itemQta[0].skuPropName
        const skuPropValueList = itemQta[0].skuPropValueList
        for (let i = 0; i < skuPropValueList.length; i++) {
          skuPropValueList[i].skuPropId = skuPropId
          skuPropValueList[i].skuPropName = skuPropName
          skuPropValueList[i].stock = skuPropValueList[i].stock ? skuPropValueList[i].stock : 0
        }
        const obj = JSON.stringify(skuPropValueList)
        this.form.singleTable = JSON.parse(obj)
      } else {
        const skuCache = {}
        if (this.form.qualityTable.length > 0) {
          this.form.qualityTable.forEach((row) => {
            let item = skuCache
            for (const col in row) {
              if (row[col].skuPropValueId) {
                if (!item[row[col].skuPropValueId]) {
                  item[row[col].skuPropValueId] = {
                    ...row
                  }
                }
                item = item[row[col].skuPropValueId]
              }
            }
          })
        }
        this.form.qualityTable = []
        this.showSingle = 0
        for (let i = 0; i < itemQta.length; i++) {
          const skuPropId = itemQta[i].skuPropId
          const skuPropName = itemQta[i].skuPropName
          for (let j = 0; j < itemQta[i].skuPropValueList.length; j++) {
            itemQta[i].skuPropValueList[j].skuPropId = skuPropId
            itemQta[i].skuPropValueList[j].skuPropName = skuPropName
          }
          arrQta.push(itemQta[i].skuPropValueList)
        }
        this.form.qualityTable = this.$utils.descartes(arrQta)
        if (this.form.qualityTable.length > 0) {
          const skuIdCache = {}
          const externalCodeCache = {}
          this.form.qualityTable.forEach((row, index) => {
            let item = skuCache
            for (const col in row) {
              if (row[col].skuPropValueId) {
                if (item[row[col].skuPropValueId]) {
                  item = item[row[col].skuPropValueId]
                }
              }
            }
            // 新增子规格，设置原来的sku的值
            if (item.skuId && !skuIdCache[item.skuId]) {
              // 新增规格不能复用skuId
              skuIdCache[item.skuId] = true
              this.$set(this.form.qualityTable[index], 'skuId', item.skuId)
            }
            if (item.supplyPrice) {
              this.$set(this.form.qualityTable[index], 'supplyPrice', item.supplyPrice)
            }
            if (item.price) {
              this.$set(this.form.qualityTable[index], 'price', item.price)
            }
            if (item.memberPrice) {
              this.$set(this.form.qualityTable[index], 'memberPrice', item.memberPrice)
            }
            if (item.anchorPaymentsPrice) {
              this.$set(this.form.qualityTable[index], 'anchorPaymentsPrice', item
                .anchorPaymentsPrice)
            }
            if (item.specimenPrice) {
              this.$set(this.form.qualityTable[index], 'specimenPrice', item.specimenPrice)
            }
            if (item.scribingPrice) {
              this.$set(this.form.qualityTable[index], 'scribingPrice', item.scribingPrice)
            }
            if (item.wholesalePrice) {
              this.$set(this.form.qualityTable[index], 'wholesalePrice', item.wholesalePrice)
            }
            if (item.goodsBarCode) {
              this.$set(this.form.qualityTable[index], 'goodsBarCode', item.goodsBarCode)
            }
            if (item.wholesaleDeliveryTemplateId) {
              this.$set(this.form.qualityTable[index], 'wholesaleDeliveryTemplateId', item.wholesaleDeliveryTemplateId)
            }
            if (item.externalCode && !externalCodeCache[item.externalCode]) {
              // 新增规格不能复用外部编码
              externalCodeCache[item.externalCode] = true
              this.$set(this.form.qualityTable[index], 'externalCode', item.externalCode)
            }
            if (item.stock) {
              this.$set(this.form.qualityTable[index], 'stock', item.stock)
            } else {
              // 设置默认值
              this.$set(this.form.qualityTable[index], 'stock', '0')
            }
            if (item.imageUrl) {
              this.$set(this.form.qualityTable[index], 'imageUrl', item.imageUrl)
            }
          })
        }
      }
    },
    setQualityTable(dataTable) {
      const skuValueMap = new Map()
      for (let i = 0; i < dataTable.length; i++) {
        skuValueMap.set(dataTable[i].skuValueIds, dataTable[i])
      }
      const qualityTable = this.form.qualityTable
      const qualityData = this.form.qualityData
      if (qualityData.length === 1) {
        const skuPropValueList = qualityData[0].skuPropValueList
        const skuPropId = qualityData[0].skuPropId
        const skuPropName = qualityData[0].skuPropName

        for (let i = 0; i < skuPropValueList.length; i++) {
          skuPropValueList[i].skuPropId = skuPropId
          skuPropValueList[i].skuPropName = skuPropName
          const skuPropValueId = skuPropValueList[i].skuPropValueId
          const array = []
          array.push(skuPropValueId)
          const skuValueKey = array.sort().toString()
          const skuValueObj = skuValueMap.get(skuValueKey)
          if (!skuValueObj) {
            console.log('查无sku信息：' + skuValueKey)
            continue
          }
          if (skuValueObj.skuId) {
            skuPropValueList[i].skuId = skuValueObj.skuId
          }
          skuPropValueList[i].imageUrl = this.$utils.isExist(skuValueObj.imageUrl) ? skuValueObj.imageUrl : ''
          skuPropValueList[i].price = this.$utils.isExist(skuValueObj.price) ? skuValueObj.price : ''
          this.minSellPrice = skuPropValueList[i].price
          this.maxSellPrice = skuPropValueList[i].price
          // 主播结算价
          skuPropValueList[i].anchorPaymentsPrice = this.$utils.isExist(skuValueObj.anchorPaymentsPrice) ? skuValueObj.anchorPaymentsPrice : ''
          // 样品价
          skuPropValueList[i].specimenPrice = this.$utils.isExist(skuValueObj.specimenPrice) ? skuValueObj.specimenPrice : ''
          skuPropValueList[i].memberPrice = this.$utils.isExist(skuValueObj.memberPrice) ? skuValueObj.memberPrice : ''
          skuPropValueList[i].scribingPrice = this.$utils.isExist(skuValueObj.scribingPrice) ? skuValueObj.scribingPrice : ''
          skuPropValueList[i].wholesalePrice = this.$utils.isExist(skuValueObj.wholesalePrice) ? skuValueObj.wholesalePrice : ''
          skuPropValueList[i].goodsBarCode = this.$utils.isExist(skuValueObj.goodsBarCode) ? skuValueObj.goodsBarCode : ''
          skuPropValueList[i].wholesaleDeliveryTemplateId = this.$utils.isExist(skuValueObj.wholesaleDeliveryTemplateId) ? skuValueObj.wholesaleDeliveryTemplateId : ''
          skuPropValueList[i].externalCode = this.$utils.isExist(skuValueObj.externalCode) ? skuValueObj.externalCode : ''
          skuPropValueList[i].supplyPrice = this.$utils.isExist(skuValueObj.supplyPrice) ? skuValueObj.supplyPrice : ''
          skuPropValueList[i].stock = this.$utils.isExist(skuValueObj.stock) ? skuValueObj.stock : '0'
          skuPropValueList[i].warnStock = this.$utils.isExist(skuValueObj.warnStock) ? skuValueObj.warnStock : ''
          skuPropValueList[i].subGoodsList = this.$utils.isExist(skuValueObj.projectGoodsList) ? skuValueObj.projectGoodsList : ''
        }

        // this.form.singleTable = skuPropValueList
        const obj = JSON.stringify(skuPropValueList)
        this.form.singleTable = JSON.parse(obj)
      } else {
        const array = []
        for (let i = 0; i < qualityTable.length; i++) {
          const item = qualityTable[i]
          const skuPropValueList = []
          for (const key in item) {
            if (this.$utils.isExist(item[key].skuPropId)) {
              const skuPropValueId = item[key].skuPropValueId
              skuPropValueList.push(skuPropValueId)
            }
          }

          const obj = {}
          const skuValueKey = skuPropValueList.sort().toString()
          const skuValueObj = skuValueMap.get(skuValueKey)
          if (skuValueObj != null) {
            if (skuValueObj.skuId) {
              obj.skuId = skuValueObj.skuId
            }
            for (const key in item) {
              obj[key] = item[key]
            }
            obj.imageUrl = this.$utils.isExist(skuValueObj.imageUrl) ? skuValueObj.imageUrl : ''
            obj.price = this.$utils.isExist(skuValueObj.price) ? skuValueObj.price : ''
            // 最低和最高零售价
            if (obj.price !== '' && obj.price > this.maxSellPrice) {
              this.maxSellPrice = obj.price
            }
            if (obj.price !== '' && obj.price < this.minSellPrice) {
              this.minSellPrice = obj.price
            }
            // 主播结算价
            obj.anchorPaymentsPrice = this.$utils.isExist(skuValueObj.anchorPaymentsPrice) ? skuValueObj.anchorPaymentsPrice : ''
            // 样品价
            obj.specimenPrice = this.$utils.isExist(skuValueObj.specimenPrice) ? skuValueObj.specimenPrice : ''
            obj.memberPrice = this.$utils.isExist(skuValueObj.memberPrice) ? skuValueObj.memberPrice : ''
            obj.scribingPrice = this.$utils.isExist(skuValueObj.scribingPrice) ? skuValueObj.scribingPrice : ''
            obj.wholesalePrice = this.$utils.isExist(skuValueObj.wholesalePrice) ? skuValueObj.wholesalePrice : ''
            obj.goodsBarCode = this.$utils.isExist(skuValueObj.goodsBarCode) ? skuValueObj.goodsBarCode : ''
            obj.wholesaleDeliveryTemplateId = this.$utils.isExist(skuValueObj.wholesaleDeliveryTemplateId) ? skuValueObj.wholesaleDeliveryTemplateId : ''
            obj.externalCode = this.$utils.isExist(skuValueObj.externalCode) ? skuValueObj.externalCode : ''
            obj.supplyPrice = this.$utils.isExist(skuValueObj.supplyPrice) ? skuValueObj.supplyPrice : ''
            obj.stock = this.$utils.isExist(skuValueObj.stock) ? skuValueObj.stock : '0'
            obj.warnStock = this.$utils.isExist(skuValueObj.warnStock) ? skuValueObj.warnStock : ''
            obj.subGoodsList = this.$utils.isExist(skuValueObj.projectGoodsList) ? skuValueObj.projectGoodsList : ''
            array.push(obj)
          } else {
            console.log('sku异常' + skuValueKey)
          }
        }
        this.form.qualityTable = array
      }
    },
    categoryChange() {
      listCategorySku(this.categoryId).then((response) => {
        if (response.isError) return
        this.categorySkuList = response.data
      })
    },
    // 批量更新sku价格，库存
    batchUpdateSkuParamPrice() {
      const paramValue = this.skuParamSettingValue
      const skuParamSettingType = this.skuParamSettingType
      const qualityData = this.form.qualityData
      if (qualityData.length === 1) {
        for (let i = 0; i < this.form.singleTable.length; i++) {
          if (skuParamSettingType === '1') {
            this.visiblePopPrice = false
            this.$set(this.form.singleTable[i], 'price', paramValue)
            this.minSellPrice = paramValue
            this.maxSellPrice = paramValue
          } else if (skuParamSettingType === '3') {
            this.visiblePopSupplyPrice = false
            this.$set(this.form.singleTable[i], 'supplyPrice', paramValue)
          } else if (skuParamSettingType === '4') {
            this.visiblePopScribingPrice = false
            this.$set(this.form.singleTable[i], 'scribingPrice', paramValue)
          } else if (skuParamSettingType === '5') {
            this.visiblePopWholesalePrice = false
            this.$set(this.form.singleTable[i], 'wholesalePrice', paramValue)
          } else if (skuParamSettingType === '6') {
            this.visiblePopGoodsBarCode = false
            this.$set(this.form.singleTable[i], 'goodsBarCode', paramValue)
          } else if (skuParamSettingType === '8') {
            this.visibleWholesaleDeliveryTemplateId = false
            this.$set(this.form.singleTable[i], 'wholesaleDeliveryTemplateId', paramValue)
          } else if (skuParamSettingType === '2') {
            this.visiblePopStock = false
            this.$set(this.form.singleTable[i], 'stock', paramValue || '0')
          } else if (skuParamSettingType === '9') {
            // 主播结算价
            this.visiblePopAnchorPrice = false
            this.$set(this.form.singleTable[i], 'anchorPaymentsPrice', paramValue)
          } else if (skuParamSettingType === '10') {
            // 样品价
            this.visiblePopSpecimenPrice = false
            this.$set(this.form.singleTable[i], 'specimenPrice', paramValue)
          } else if (skuParamSettingType === '11') {
            // 分销价
            this.visiblePopDistributePrice = false
            this.$set(this.form.singleTable[i], 'distributePrice', paramValue)
          } else if (skuParamSettingType === '12') {
            // 预警库存
            this.visiblePopWarnStock = false
            this.$set(this.form.singleTable[i], 'warnStock', paramValue)
          } else if (skuParamSettingType === '13') {
            // 会员价
            this.visiblePopMemberPrice = false
            this.$set(this.form.singleTable[i], 'memberPrice', paramValue)
          }
        }
      } else {
        const qualityTable = this.form.qualityTable
        for (let i = 0; i < qualityTable.length; i++) {
          if (skuParamSettingType === '1') {
            this.visiblePopPrice = false
            this.$set(this.form.qualityTable[i], 'price', paramValue)
            this.minSellPrice = paramValue
            this.maxSellPrice = paramValue
          } else if (skuParamSettingType === '3') {
            this.visiblePopSupplyPrice = false
            this.$set(this.form.qualityTable[i], 'supplyPrice', paramValue)
          } else if (skuParamSettingType === '4') {
            this.visiblePopScribingPrice = false
            this.$set(this.form.qualityTable[i], 'scribingPrice', paramValue)
          } else if (skuParamSettingType === '5') {
            this.visiblePopWholesalePrice = false
            this.$set(this.form.qualityTable[i], 'wholesalePrice', paramValue)
          } else if (skuParamSettingType === '6') {
            this.visiblePopGoodsBarCode = false
            this.$set(this.form.qualityTable[i], 'goodsBarCode', paramValue)
          } else if (skuParamSettingType === '8') {
            this.visibleWholesaleDeliveryTemplateId = false
            this.$set(this.form.qualityTable[i], 'wholesaleDeliveryTemplateId', paramValue)
          } else if (skuParamSettingType === '2') {
            this.visiblePopStock = false
            this.$set(this.form.qualityTable[i], 'stock', paramValue || '0')
          } else if (skuParamSettingType === '9') {
            // 主播结算价
            this.visiblePopAnchorPrice = false
            this.$set(this.form.qualityTable[i], 'anchorPaymentsPrice', paramValue)
          } else if (skuParamSettingType === '10') {
            // 样品价
            this.visiblePopSpecimenPrice = false
            this.$set(this.form.qualityTable[i], 'specimenPrice', paramValue)
          } else if (skuParamSettingType === '11') {
            // 分销价
            this.visiblePopDistributePrice = false
            this.$set(this.form.qualityTable[i], 'distributePrice', paramValue)
          } else if (skuParamSettingType === '12') {
            // 预警库存
            this.visiblePopWarnStock = false
            this.$set(this.form.qualityTable[i], 'warnStock', paramValue)
          } else if (skuParamSettingType === '13') {
            // 会员价
            this.visiblePopMemberPrice = false
            this.$set(this.form.qualityTable[i], 'memberPrice', paramValue)
          }
        }
      }
      this.editSkuParamSettingVisible = false
    },
    getID(length) {
      const ids = this.ids
      const id = -parseInt(Math.round(Math.random() * 100000000))
      if (ids.indexOf(id) > 0) {
        this.getID()
      } else {
        ids.push(id)
        this.ids = ids
        return id
      }
    },
    changeImage(index) {
      this.imageIndex = index
    },
    // 图片
    beforeUpload(file) {
      this.fileChangeFlag = '0'
      const isJPG = file.type === 'image/jpeg'
      const isGIF = file.type === 'image/gif'
      const isPNG = file.type === 'image/png'
      const isBMP = file.type === 'image/bmp'

      if (!isJPG && !isGIF && !isPNG && !isBMP) {
        this.$message.error('上传图片必须是JPG/GIF/PNG/BMP 格式!')
      }
      this.fileLoading = true
      return isJPG || isBMP || isGIF || isPNG
    },
    getLoading(index) {
      const that = this
      if (that.loadingTotal === '1' && this.imageIndex === index) {
        return true
      } else {
        return false
      }
    },
    handleUploadSuccess(res, file) {
      this.loadingTotal = '0'
      if (res.code === 101) {
        const qualityData = this.form.qualityData
        if (qualityData.length === 1) {
          const singleTable = this.form.singleTable
          for (let i = 0; i < singleTable.length; i++) {
            const imageIndex = this.imageIndex
            if (imageIndex * 1 === i) {
              singleTable[i].imageUrl = res.data[0]
            }
          }
        } else {
          const imageIndex = this.imageIndex
          const qualityTable = this.form.qualityTable
          for (let i = 0; i < qualityTable.length; i++) {
            if (imageIndex * 1 === i) {
              qualityTable[i].imageUrl = res.data[0]
            }
          }
        }
      } else {
        this.$message({
          type: 'error',
          message: res.msg
        })
        return false
      }
      this.$forceUpdate()
    },
    // 编辑初始化页面数据
    initGoodsEdit() {
      const that = this
      this.$bus.$on('goods.edit.data', function(data) {
        that.form.goodsId = data.goodsId
        that.form.goodsSource = data.goodsSource || 0
        if (data.goodsSource === 0) {
          that.updataFlag = false
        } else {
          that.updataFlag = true
        }
        that.form.memberGradeAuth = data.memberGradeAuth
        if (that.getVersionType() * 1 === 5) {
          // 社区版，供应商价格可编辑
          that.updataFlag = false
        }
        if (that.enterpriseConfig.warehouseAuthority === 1 && that.enterpriseConfig.warehouseDeliverFlag === 1) {
          that.stockBoolean = true
        }
        const skuFlag = that.$utils.isExist(data.skuFlag) ? data.skuFlag + '' : '0'
        that.form.skuFlag = skuFlag
        that.form.supplierPostFee = that.$utils.isExist(data.supplierPostFee) ? data.supplierPostFee : '0'
        that.form.postFeeType = that.$utils.isExist(data.postFeeType) ? data.postFeeType.toString() : '10'
        that.form.postFee = that.$utils.isExist(data.postFee) ? data.postFee : '0'
        that.form.wholesaleDeliveryTemplateId = data.wholesaleDeliveryTemplateId
        that.form.wholesalePostFeeType = that.$utils.isExist(data.wholesalePostFeeType) ? data.wholesalePostFeeType.toString() : '10'
        that.form.wholesalePostFee = that.$utils.isExist(data.wholesalePostFee) ? data.wholesalePostFee : '0'
        // 供应价含税
        that.form.supplierTaxFlag = that.$utils.isExist(data.supplierTaxFlag) ? data.supplierTaxFlag.toString() : '1'
        // 进项税税目
        that.form.sellPrice = that.$utils.isExist(data.sellPrice) ? data.sellPrice : ''
        that.form.stock = that.$utils.isExist(data.stock) ? data.stock + '' : '0'
        that.form.stockWarn = that.$utils.isExist(data.stockWarn) ? data.stockWarn + '' : ''
        that.form.distributeType = that.$utils.isExist(data.distributeType) ? data.distributeType : 1
        that.form.distributeFee = that.$utils.isExist(data.distributeFee) ? data.distributeFee : ''
        that.form.shareMemberFee = that.$utils.isExist(data.shareMemberFee) ? data.shareMemberFee : ''
        that.form.anchorCommission = that.$utils.isExist(data.anchorCommission) ? data.anchorCommission : ''
        that.form.levelOnePartnerFee = that.$utils.isExist(data.levelOnePartnerFee) ? data.levelOnePartnerFee : ''
        that.form.levelTwoPartnerFee = that.$utils.isExist(data.levelTwoPartnerFee) ? data.levelTwoPartnerFee : ''
        that.form.recruiterFee = that.$utils.isExist(data.recruiterFee) ? data.recruiterFee : ''
        that.form.supplyPrice = that.$utils.isExist(data.supplyPrice) ? data.supplyPrice + '' : '0'
        // 主播结算价
        that.form.anchorPaymentsPrice = that.$utils.isExist(data.anchorPaymentsPrice) ? data.anchorPaymentsPrice : ''
        // 样品价
        that.form.specimenPrice = that.$utils.isExist(data.specimenPrice) ? data.specimenPrice : ''
        // 分销价
        that.form.distributePrice = that.$utils.isExist(data.distributePrice) ? data.distributePrice : ''
        that.form.scribingPrice = that.$utils.isExist(data.scribingPrice) ? data.scribingPrice + '' : ''
        that.form.memberPrice = that.$utils.isExist(data.memberPrice) ? data.memberPrice + '' : ''
        that.form.wholesalePrice = that.$utils.isExist(data.wholesalePrice) ? data.wholesalePrice + '' : ''
        that.form.goodsBarCode = that.$utils.isExist(data.goodsBarCode) ? data.goodsBarCode + '' : ''
        that.form.wholesaleDeliveryTemplateId = that.$utils.isExist(data.wholesaleDeliveryTemplateId) ? data.wholesaleDeliveryTemplateId + '' : ''
        that.form.externalCode = that.$utils.isExist(data.externalCode) ? data.externalCode + '' : ''
        that.form.wholesaleNum = that.$utils.isExist(data.wholesaleNum) ? data.wholesaleNum + '' : ''
        that.form.ladderAuth = that.$utils.isExist(data.ladderAuth) ? data.ladderAuth + '' : ''
        that.form.templateType = that.$utils.isExist(data.templateType) ? data.templateType + '' : ''
        if (that.form.skuFlag === '0') {
          // 单规格
          // 获取套餐子商品数据
          that.initSubGoodsList(data.goodsId)
        //   that.form.subGoodsList = data.subGoodsList
        } else if (that.form.skuFlag === '1') {
          // 多规格
          const qualityData = data.qualityData
          if (qualityData.length === 1) {
            const skuPropValueList = qualityData[0].skuPropValueList
            for (let i = 0; i < skuPropValueList.length; i++) {
              skuPropValueList[i].imageUrl = ''
              skuPropValueList[i].price = ''
              // 主播结算价
              skuPropValueList[i].anchorPaymentsPrice = ''
              // 样品价
              skuPropValueList[i].specimenPrice = ''
              skuPropValueList[i].memberPrice = ''
              // 分销价
              skuPropValueList[i].distributePrice = ''
              skuPropValueList[i].scribingPrice = ''
              skuPropValueList[i].wholesalePrice = ''
              skuPropValueList[i].goodsBarCode = ''
              skuPropValueList[i].wholesaleDeliveryTemplateId = ''
              skuPropValueList[i].externalCode = ''
              skuPropValueList[i].supplyPrice = ''
              skuPropValueList[i].stock = '0'
              skuPropValueList[i].warnStock = ''
            }
          }
          that.form.qualityData = qualityData
          that.form.dataTable = data.qualityTable
          that.qualityInit()
          that.setQualityTable(data.qualityTable)
        }
      })
    },
    // 检查表单属性
    checkForm() {
      if (this.form.skuFlag === '0') {
        // 单规格表单属性校验
        const subGoods = this.form.subGoodsList
        if (subGoods.length === 0) {
          this.$message({
            type: 'error',
            message: '组合商品未添加子商品'
          })
          return false
        }
        for (let i = 0; i < subGoods.length; i++) {
          const subGoodsNum = subGoods[i].goodsNum
          if (!this.$utils.isExist(subGoodsNum)) {
            this.$message({
              type: 'error',
              message: '子商品的数量不能为空'
            })
            return false
          }
        }
      } else {
        // 多规格表单属性校验
        let total1 = 0
        if (this.form.distributeType === 2) {
          const distributeFee = this.form.distributeFee
          total1 = distributeFee == null ? 0 : distributeFee
        }
        // 校验属性名称是否相同
        const propNames = []
        const qualityData = this.form.qualityData
        for (let i = 0; i < qualityData.length; i++) {
          const skuPropName = qualityData[i].skuPropName
          if (!this.$utils.isExist(skuPropName)) {
            this.$message({
              type: 'error',
              message: '商品规格不能为空'
            })
            return false
          }
          const usePropValueList = []
          const skuPropValueList = qualityData[i].skuPropValueList
          for (let j = 0; j < skuPropValueList.length; j++) {
            const skuPropValue = skuPropValueList[j].skuPropValue
            if (!this.$utils.isExist(skuPropValue)) {
              this.$message({
                type: 'error',
                message: '商品属性不能为空'
              })
              return false
            }

            if (usePropValueList.indexOf(skuPropValue) !== -1) {
              this.$message({
                type: 'error',
                message: '同规格下属性名称"' + skuPropValue + '"重复'
              })
              return false
            } else {
              usePropValueList.push(skuPropValue)
            }
          }

          const propName = qualityData[i].skuPropName
          if (propNames.indexOf(propName) !== -1) {
            this.$message({
              type: 'error',
              message: '规格名称"' + propName + '"重复'
            })
            return false
          } else {
            propNames.push(propName)
          }
        }

        let table = []
        if (qualityData.length === 1) {
          const singleTable = this.form.singleTable
          table = singleTable
        } else {
          const qualityTable = this.form.qualityTable
          table = qualityTable
        }

        let stockTotal = 0
        for (let i = 0; i < table.length; i++) {
          const price = table[i].price
          const wholesalePrice = table[i].wholesalePrice
          const stock = table[i].stock
          const warnStock = table[i].warnStock
          // const externalCode = table[i].externalCode
          stockTotal = stockTotal + stock
          const wholesaleDeliveryTemplateId = table[i].wholesaleDeliveryTemplateId

          if (this.fromListPage === 31 && !wholesalePrice && this.form.ladderAuth === '0') {
            this.$message({
              type: 'error',
              message: '批发价不能为空'
            })
            return false
          }
          if (!this.$utils.isExist(price) && this.fromListPage === 30) {
            this.$message({
              type: 'error',
              message: '商品规格价格不能为空'
            })
            return false
          }
          if (!this.$utils.isExist(stock)) {
            this.$message({
              type: 'error',
              message: '商品库存不能为空'
            })
            return false
          }

          if (price && price.length > 14 && this.fromListPage === 30) {
            this.$message({
              type: 'error',
              message: '商品规格价格长度不能超过14个字节'
            })
            return false
          }
          if (stock.length > 8) {
            this.$message({
              type: 'error',
              message: '商品库存长度不能超过8个字节'
            })
            return false
          }

          // 判断组合商品属性
          const subGoods = table[i].subGoodsList
          if (subGoods.length === 0) {
            this.$message({
              type: 'error',
              message: '组合商品未添加子商品'
            })
            return false
          }
          for (let i = 0; i < subGoods.length; i++) {
            const subGoodsNum = subGoods[i].goodsNum
            if (!this.$utils.isExist(subGoodsNum)) {
              this.$message({
                type: 'error',
                message: '子商品的数量不能为空'
              })
              return false
            }
          }

          // 正则表达式佣金判断
          const reg2 = /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/
          const pattern2 = new RegExp(reg2)
          if (!pattern2.test(price) && this.fromListPage === 30) {
            this.$message({
              type: 'error',
              message: '请正确输入零售价'
            })
            return false
          }
          // 正则表达式校验
          if (this.$utils.isExist(warnStock)) {
            const reg3 = /^[0-9]*[1-9][0-9]*$/
            const pattern3 = new RegExp(reg3)
            if (!pattern3.test(warnStock)) {
              this.$message({
                type: 'error',
                message: '请正确输入预警库存'
              })
              return false
            }
          }
          if (total1 * 1 > price * 1) {
            this.$message({
              type: 'error',
              message: '分销金额不能大于每个规格的价格'
            })
            return false
          }
          if (this.form.distributeType === 2) {
            const distributeFee = !this.form.distributeFee
              ? 0
              : this.form.distributeFee * 1
            if (distributeFee > price * 1) {
              this.$message({
                type: 'error',
                message: '微客佣金不能大于每个规格的价格'
              })
              return false
            }
            const shareMemberFee = !this.form.shareMemberFee
              ? 0
              : this.form.shareMemberFee * 1
            if (shareMemberFee > price * 1) {
              this.$message({
                type: 'error',
                message: '顾客分销佣金不能大于每个规格的价格'
              })
              return false
            }
            if (distributeFee + shareMemberFee > price * 1) {
              this.$message({
                type: 'error',
                message: '微客佣金+顾客分销佣金不能大于每个规格的价格'
              })
              return false
            }
          }
          if (!this.$utils.isExist(wholesaleDeliveryTemplateId) && this.fromListPage === 31 && this.form
            .wholesalePostFeeType * 1 === 12) {
            this.$message({
              type: 'error',
              message: '商品规格运费模板不能为空'
            })
            return false
          }
        }

        // 正则表达式校验
        const reg = /^[0-9]*[0-9]*$/
        const pattern = new RegExp(reg)
        if (!pattern.test(stockTotal)) {
          this.$message({
            type: 'error',
            message: '请正确输入库存'
          })
          return false
        }
      }
      return true
    },
    changeTemplateType() {
      if (this.fromListPage === 31) {
        this.form.wholesaleDeliveryTemplateId = ''
      }
    },
    // 打开选择商品事件
    addSubGoods(index) {
      this.selectGoodsVisible = true
      this.selectGoodsTitle = '选择商品'
      this.qualityTableIndex = index
    },
    // 监听子商品添加情况
    busMonitor() {
      // 子商品列表
      const that = this
      this.$bus.$on('goodsCombo.subGoodsList', function(data) {
        if (that.qualityTableIndex === -1) {
          const subGoodsList = that.form.subGoodsList
          const skuIds = subGoodsList.map(item => item.skuId)
          const goodsIds = subGoodsList.map(item => item.goodsId)
          data.forEach(item => {
            if (item.skuId) {
              if (skuIds.indexOf(item.skuId) === -1) {
                subGoodsList.push(item)
              }
            } else {
              if (goodsIds.indexOf(item.skuId) === -1) {
                subGoodsList.push(item)
              }
            }
          })
        } else {
          const itemQta = that.form.qualityData
          let table = []
          let skuIds = []
          let goodsIds = []
          if (itemQta.length === 1) {
            table = that.form.singleTable[that.qualityTableIndex]
            if (!table.subGoodsList || table.subGoodsList.length === 0) {
              that.$set(table, 'subGoodsList', data)
            } else {
              skuIds = table.subGoodsList.map(item => item.skuId)
              goodsIds = table.subGoodsList.map(item => item.goodsId)
            }
          } else {
            table = that.form.qualityTable[that.qualityTableIndex]
            if (!table.subGoodsList || table.subGoodsList.length === 0) {
              that.$set(table, 'subGoodsList', data)
            } else {
              skuIds = table.subGoodsList.map(item => item.skuId)
              goodsIds = table.subGoodsList.map(item => item.goodsId)
            }
          }
          if (skuIds.length > 0 || goodsIds.length > 0) {
            data.forEach(item => {
              if (item.skuId) {
                if (skuIds.indexOf(item.skuId) === -1) {
                  table.subGoodsList.push(item)
                }
              } else {
                if (goodsIds.indexOf(item.skuId) === -1) {
                  table.subGoodsList.push(item)
                }
              }
            })
          }
        }
        // 关闭商品选择
        setTimeout(() => { that.selectGoodsVisible = false }, 800)
      })
    },
    // 获取套餐子商品数据-单规格
    initSubGoodsList(goodsId) {
      if (!this.getEnterpriseId()) {
        this.$message({
          type: 'error',
          message: '未获取到所属企业'
        })
      }
      listSubGoods(goodsId, this.getEnterpriseId()).then(response => {
        this.form.subGoodsList = response.data
      })
    },
    // 删除子商品
    removeSubGoodsList(index, subGoods) {
      if (this.form.skuFlag === '0') {
        // 单规格
        const list = []
        this.form.subGoodsList.forEach(item => {
          if (subGoods.skuId) {
            if (item.skuId !== subGoods.skuId) {
              list.push(item)
            }
          } else if (subGoods.goodsId) {
            if (item.goodsId !== subGoods.goodsId) {
              list.push(item)
            }
          }
        })
        this.form.subGoodsList = list
      } else {
        // 多规格
        const qualityData = this.form.qualityData
        let table = []
        if (qualityData.length === 1) {
          table = this.form.singleTable[index]
        } else {
          table = this.form.qualityTable[index]
        }
        const subGoodsList = table.subGoodsList
        const list = []
        subGoodsList.forEach(item => {
          if (subGoods.skuId) {
            if (item.skuId !== subGoods.skuId) {
              list.push(item)
            }
          } else if (subGoods.goodsId) {
            if (item.goodsId !== subGoods.goodsId) {
              list.push(item)
            }
          }
        })
        table.subGoodsList = list
      }
    }
  }
}
</script>


<style lang="less" scoped>
.table-container {
    min-height: auto;
}

.quality-bar {
    background: #f2f2f2;
    border: #e4e4e4 1px solid;
    padding: 10px;

    .close-quality {
        color: #515151;
    }

    .close-sub {
        color: #aeaeae;
        position: absolute;
        right: -6px;
        top: -6px;
        font-size: 18px;
    }

    .qta-item:before {
        content: '';
        position: absolute;
        left: 12px;
        top: 34px;
        width: 1px;
        height: 46px;
        background: #bcbcbc;
    }

    .qta-item:after {
        content: '';
        position: absolute;
        left: 12px;
        top: 79px;
        width: 19px;
        height: 1px;
        background: #bcbcbc;
    }
}

.span-bar {
    padding: 0 50px;
}

.remove-btn {
    padding: 7px 6px !important;
}

.long-input {
    width: 80%;
}

.long-input-2 {
    width: 55%;
    margin-right: 5%;
}

.long-input-3 {
    width: 55%;
}

.short-input {
    width: 20%;
}

.short-input-2 {
    width: 25%;
}

.default-input {
    width: 80%;

    @media screen and (max-width: 1440px) {
        width: 100%;
    }
}

.tips {
    color: gray;
    font-size: 12px;
    line-height: 1.2;
    padding-top: 5px;
}

.picture {
    width: 130px;
    height: 130px;
    display: block;
}

.pic-bar {
    position: relative;

    .close-icon {
        position: absolute;
        right: -30px;
        top: -11px;
        width: 31px;
        height: 40px;
        padding: 0 7px;
        cursor: pointer;
    }

    span {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 100%;
        display: block;
        color: #fff;
        text-align: center;
        padding: 3px 0;
        background: rgba(0, 0, 0, 0.5);
        cursor: pointer;
    }
}

.pic-add {
    background: #fff;
    border: #d3d3d3 1px dashed;
    border-radius: 5px;
    padding: 0 45px;
}

.input-bar-0 {
    width: 35% !important;
}

.input-bar-1 {
    width: 40%;
    margin-bottom: 5px !important;
}

.input-bar-2 {
    width: 60%;
    margin-bottom: 5px !important;
}

.input-bar-3 {
    width: 100%;
    margin-bottom: 5px !important;
}

.input-bar-4 {
    width: 35% !important;
}

.width-input-1 {
    width: 100% !important;
}

.width-input-2 {
    width: 35% !important;
}

.width-input-3 {
    width: 30% !important;
}

.width-date {
    width: 200px !important;
}

.gray-bar {
    background: #fff;
    padding: 5px 0 0 0;
    margin-bottom: 20px;
}

.gray-active {
    margin-right: 20px;
    // padding: 15px 13px;

    &.active {
        background: #fff;
    }
}

.radio-top-bar {
    margin-bottom: -22px;

    /deep/ .el-input-group__append,
    .el-input-group__prepend {
        padding: 0 10px;
    }
}

.noraml-height {
    height: 40px;
}

.border-d7 {
    /deep/ .el-input__inner {
        padding: 0;
        padding-left: 10px;
    }
}

.sub-list {
    /deep/ .el-collapse {
        border-top: 0px solid #fff !important;
        border-bottom: 0px solid #fff !important;
    }

    /deep/ .el-collapse-item__header {
        border-bottom: 0px;
    }
}
</style>
